<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="keywords" content="为米，为米网，大数据">
    <meta name="description" content="">
    <meta name="author" content="vimi8.com">
    <meta name="renderer" content="webkit">
    <link rel="icon" href="icon.ico">
    <title>为米管理后台</title>
    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css">
    <link href="css/common.css" rel="stylesheet">
    <link href="css/classify.css" rel="stylesheet">
</head>

<body>
<div id="wrapper">
    <div class="ht-top">
        <nav class="ht-navbar" role="navigation">
            <div class="ht-navbar-header">
                <a class="ht-navbar-brand" href="#">铜仁商务局管理后台</a>
            </div>
            <ul class="nav ht-navbar-nav">
                <!--<li class="active"><a href="#">1</a></li>
                <li><a href="#">2</a></li>-->
            </ul>
            <ul class="nav ht-navbar-nav navbar-right">
                <li class="active">
                    <span>下午好</span>&nbsp;&nbsp;
                    <span>为米1</span>&nbsp;&nbsp;
                </li>
                <li>
                    <img src="http://qzapp.qlogo.cn/qzapp/100414805/830A5F805EB7FBC2E1E03D5ADB844CA2/100" width="25" height="25" alt="" class="img-circle">&nbsp;&nbsp;
                </li>
                <li>
                    <a href="#" title="退出登录" class="active"><i class="fa fa-power-off"></i></a>
                </li>
            </ul>
        </nav>
    </div>
    <div class="ht-content">
        <aside class="ht-aside">
            <ul class="list-unstyled ht-aside-nav">
                <li>
                    <div class="ht-aside-item">
                        <a href="index.html"><i class="fa fa-home fa-fw"></i> 农场管理</a>
                    </div>
                </li>
                <li>
                    <div class="ht-aside-item">
                        <a href="#collapseTwo"><i class="fa fa-product-hunt fa-fw"></i> 产品管理</a>
                    </div>
                </li>
                <li>
                    <div class="ht-aside-item">
                        <a data-toggle="collapse" href="#collapseThree">
                            <i class="fa fa-sitemap fa-fw"></i> 分类管理
                            <i class="fa fa-angle-down angle"></i>
                        </a>
                    </div>

                    <div id="collapseThree" class="collapse in">
                        <ul class="list-unstyled">
                            <li class="ht-aside-item nl"><a href="farmclassify.html" ><i class="fa fa-fw fa-code-fork text-muted"></i> 农场分类</a></li>
                            <li class="ht-aside-item nl"><a href="productclassify.html" class="active"><i class="fa fa-fw fa-cogs text-muted"></i> 产品分类</a></li>
                        </ul>
                    </div>
                </li>
            </ul>
        </aside>
        <div class="ht-main">
            <div class="ht-title">
                <h3 class="pull-left">产品分类</h3>
            </div>

            <div class="ht-panel">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-xs-3 col-sm-3">
                                <div>
                                    <div class="area-village">
                                        <ul class="list-unstyled">
                                            <div class="maginright">
                                                <li class="active"><a href="#area" data-toggle="tab"><i class="fa fa-file"></i>&nbsp;(00)</a></li>
                                                <div class="tab-pane" id="area">
                                                    <ul class="list-unstyled list-inline">
                                                    </ul>
                                                </div>
                                            </div>
                                        </ul>
                                        <ul class="list-unstyled" id="zareaList">

                                            <div class="maginright" v-for="onetodu in message">
                                                <li class="active"><i class="fa fa-plus">&nbsp;</i><a href="#areaB0" data-areaid="{{onetodu.categoryLevel}}" data-content-id="{{onetodu.categoryIcon}}" title="{{onetodu.id}}">{{onetodu.categoryName}}</a></li>
                                                <div class="tab-pane" id="areaB0">
                                                    <ul class="list-unstyled">
                                                        <div class="maginright" v-for="twotodu in onetodu.nextCategory">
                                                            <li><i class="fa fa-plus">&nbsp;</i><a href="#" data-areaid="{{twotodu.categoryLevel}}" data-content-id="{{twotodu.categoryIcon}}" title="{{twotodu.id}}">{{twotodu.categoryName}}</a></li>
                                                            <div class="tab-pane maginright" id="areaB00">
                                                                <ul class="list-unstyled">
                                                                    <div class="maginright" v-for="threetodu in twotodu.nextCategory">
                                                                        <li><i class="fa fa-plus">&nbsp;</i><a href="#" data-areaid="{{threetodu.categoryLevel}}" data-content-id="{{threetodu.categoryIcon}}" title="{{threetodu.id}}">{{threetodu.categoryName}}</a></li>
                                                                        <div class="tab-pane maginright" id="areaB000">
                                                                            <ul class="list-unstyled  maginright">
                                                                                <li v-for="fourtodu in threetodu.nextCategory"><i class="fa fa-file">&nbsp;</i><a href="#" data-areaid="{{fourtodu.categoryLevel}}" data-content-id="{{fourtodu.categoryIcon}}" title="{{fourtodu.id}}">{{fourtodu.categoryName}}</a></li>
                                                                            </ul>
                                                                        </div>
                                                                    </div>
                                                                </ul>
                                                            </div>
                                                        </div>
                                                    </ul>
                                                </div>
                                            </div>
                                        </ul>
                                        </div>
                                    </div>
                                </div>

                            <div class="col-xs-6 col-sm-6 list-unstyled">
                                <div class="form-group row">
                                    <label for="name" class="col-sm-2 control-label">编号<i class="fa fa-star" style="color:red"></i></label>
                                    <div class="col-sm-6">
                                        <input type="number" class="form-control" id="name" placeholder="" onkeyup="value=value.replace(/[^\d.]/g,'')" maxlength="12" onclick="clickNum()">
                                    </div>
                                </div>
                                <span id="namea" style="color:red"></span>
                                <div class="form-group row">
                                    <label for="name" class="col-sm-2 control-label">分类级别<i class="fa fa-star" style="color:red"></i></label>
                                    <div class="col-sm-6">
                                        <input type="number" class="form-control" id="lev" placeholder="" onkeyup="value=value.replace(/[^\d.]/g,'')" maxlength="2">
                                    </div>
                                </div>
                                <span id="leva" style="color:red"></span>
                                <div class="form-group row">
                                    <label for="scale" class="col-sm-2 control-label">名称<i class="fa fa-star" style="color:red"></i></label>
                                    <div class="col-sm-6">
                                        <input type="text" class="form-control" id="scale" placeholder="" >
                                    </div>
                                </div>
                                <span id="scalea" style="color:red"></span>
                                <div class="form-group row">
                                    <label for="scaleUnit" class="col-sm-2 control-label">图标</label>
                                    <div class="col-sm-6">
                                        <input type="text" class="form-control" id="scaleUnit" placeholder="">
                                    </div>
                                    <div class="col-sm-2">
                                        <i id="setIcon"></i>
                                    </div>
                                </div>
                                <a><span onclick="clickCreate()">新增分类</span>&nbsp;
                                    <span onclick="clickUpdate()">修改分类</span>&nbsp;
                                    <span onclick="clickDelate()">删除</span>
                                </a>
                            </div>
                            <div class="col-xs-3 col-sm-3">
                                <div id="setNum123" class="tab-pane">共三级：
                                    <span id="s1" style="background-color:red">111</span>&nbsp;
                                    <span id="s2" style="background-color:green">111</span>&nbsp;
                                    <span id="s3" style="background-color:blue">111</span>&nbsp;
                                    <span id="s4" style="background-color:yellow">111</span>
                                </div>
                            </div>
                        </div>


                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="node_modules/jsviews/jsviews.min.js"></script>
<script src="node_modules/twbs-pagination/jquery.twbsPagination.min.js"></script>
<script type="text/javascript" src="js/vue.min.js" ></script>

<!--高德地图-->
<script src="http://webapi.amap.com/maps?v=1.3&key=d386663c19f421e1130e204a6bae281d"></script>
<script src="js/common.js"></script>
<script src="js/productclassify.js"></script>
</body>

</html>
